<template>
    <view class="pub_page pub_page_bg pub_mine_service pub_header_padding">
        <pub-head :headerConfig="headerConfig"></pub-head>
        <pub-dialog v-show="dialogShow" :dialogConfig="dialogConfig" @dialogBack="dialogBack"></pub-dialog>
        <z-paging ref="Zpaging" class="pub_page_scroll page_box" v-model="list" @query="getList"
            :refresher-enabled="false" :show-loading-more-no-more-view="false" :fixed="false" :hide-empty-view="true">
            <div class="info_div" v-if="userInfo">
                <div class="li_1">当前等级：<span class="span">{{ $constant.gradeInfo[userInfo.grade] }}</span></div>
                <br>
                <div class="li_1">承兑汇票：<span class="num">{{ userInfo.acceptanceBill || 0 }}</span></div>
                <!-- <div class="btn pub_btn">领票</div> -->
            </div>
            <div class="service_div">
                <div class="tab_box">
                    <div class="tab" :class="{tab_active:mType==1}" @click="mTypeClick(1)">业务主管</div>
                    <div class="tab" :class="{tab_active:mType==2}" @click="mTypeClick(2)">业务经理</div>
                </div>
                <div class="search_box">
                    <pub-search :maxLength="11" ref="pubSearch" class="search" placeholder="输入业务账户" btnTxt="确认开通" @click="toManage" />
                </div>
                <div class="lis_box">
                    <div class="th">
                        <div class="td td_1">头像</div>
                        <div class="td td_2">昵称</div>
                        <div class="td td_3">联系方式</div>
                        <div class="td td_4">操作</div>
                    </div>
                    <div class="tr" v-for="(li,key) in list" :key="key">
                        <div class="td td_1">
                            <pub-image class="img" :src="li.avatar" :mode="'aspectFit'"></pub-image>
                        </div>
                        <div class="td td_2">
                            <span class="name">{{ li.nickName }}</span>
                            <span class="grade" v-if="li.grade==0">{{ $constant.specialGradeInfo[li.specialGrade] }}</span>
                            <span class="grade" v-else>{{ $constant.gradeInfo[li.grade] }}</span>
                        </div>
                        <div class="td td_3">{{ li.mobile }}</div>
                        <div class="td td_4" @click="pageDeal('to_cancel',li)">取消</div>
                    </div>
                    <div class="pub_nodata_1" v-if="list.length==0 && loadFinish">暂无数据</div>
                </div>
            </div>
            <br>
        </z-paging>
    </view>
</template>

<script>
export default {
    data() {
        return {
            headerConfig: {
                title: '业务管理',//标题栏内容
                left_type: 3,
                title_color: '#000',
                left_content: 'dark',
                header_color: '#fff'
            },

            dialogShow: false,
            dialogType: '',
            dialogConfig: {
                title: '提示',//标题栏内容
                content: ''
            },
            dialogData: {},

            userInfo: '',
            mType: 1,//1业务主管  2业务经理
            loadFinish:false,
            list: []
        };
    },
    onLoad() {
        this.getInfo();
        setTimeout(() => {
            this.mTypeClick()
        }, 400);
    },
    methods: {
        dialogBack(data) {
            // console.log(data);
            this.dialogShow = false;
            if (data.key == 1) {
                this.pageDeal(this.dialogType)
            }
        },
        async toManage(data) {
            if (!data.searchVal) {
                this.$comFun.toast('请填写账号')
                return;
            }
            this.$comFun.openLoading();
            const res = await this.$request.get('user/setManage', {
                mobile: data.searchVal,
                type: this.mType
            });
            this.$comFun.closeLoading();
            if (res.code == 200) {
                this.$comFun.toast('操作成功')
                this.$refs.pubSearch.clearVal();
                this.mTypeClick()
            } else {
                this.$comFun.toast(res.message)
            }
        },
        async getInfo() {
            if (this.userInfo == '') {
                this.$comFun.openLoading();
            }
            const res = await this.$request.get('user/userInfo', {});
            if (this.userInfo == '') {
                this.$comFun.closeLoading();
            }
            // console.log(res);
            if (res.code == 200) {
                this.userInfo = res.result;
            }
        },
        mTypeClick(type) {
            if (type) {
                this.mType = type
                this.$refs.pubSearch.clearVal();
            }
            this.loadFinish = false
            this.$comFun.openLoading();
            this.$refs.Zpaging.reload()
        },
        async getList(pageNo, pageSize) {
            const res = await this.$request.get('user/getManagerPage', {
                pageNo: pageNo,
                pageSize: pageSize,
                type: this.mType
            });
            this.$comFun.closeLoading();
            // console.log(res);
            this.loadFinish = true
            if (res.code == 200) {
                this.$refs.Zpaging.complete(res.result.records);
            } else {
                this.$refs.Zpaging.complete(false);
            }
        },
        async pageDeal(type, data_1, data_2) {
            switch (type) {
                case 'to_cancel':
                    this.dialogData = {
                        mobile: data_1.mobile
                    }
                    this.dialogType = 'sure_cancel';
                    this.dialogConfig = {
                        title: '提示',//标题栏内容
                        content: '是否确定取消？'
                    }
                    this.dialogShow = true;
                    break;
                case 'sure_cancel':
                    this.$comFun.openLoading();
                    const res_2 = await this.$request.get('user/setManager', {
                        mobile: this.dialogData.mobile
                    });
                    // console.log(res_2);
                    this.$comFun.closeLoading();
                    if (res_2.code == 200) {
                        this.mTypeClick();
                        this.$comFun.toast('操作成功');
                    } else {
                        this.$comFun.toast(res_2.message);
                    }
                    break;
                default:
                    break;
            }
        },
    },
};
</script>

<style lang="scss" scoped>
@import "@/common/css/mine.scss";
</style>
